<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
  <meta content="yes" name="apple-mobile-web-app-capable">
  <meta content="black" name="apple-mobile-web-app-status-bar-style">
  <meta content="telephone=no" name="format-detection">
  <meta content="email=no" name="format-detection">
  <link rel="stylesheet" href="/static/home/css/reset.css">
  <link rel="stylesheet" href="/static/home/plug/layui/css/layui.css">
  <title>邀约详情</title>
  <script type="text/javascript" src="{__SGHOME_PATH}js/jquery-3.1.1.min.js"></script>
  <script type="text/javascript" src="{__SGHOME_PATH}js/qrcode.min.js"></script>
  <script type="text/javascript" src="{__SGHOME_PATH}js/vconsole.min.js"></script>
  <script src="/static/home/plug/layui/layui.js"></script>
  <script>
    var local_url="/static/admin/js/";
    var deviceWidth = document.documentElement.clientWidth;
    document.documentElement.style.fontSize = deviceWidth / 7.5 + 'px';
    var vConsole = new window.VConsole();
  </script>
  <script src="/static/admin/js/base.js"></script>
  <style>
    *{
      padding: 0; margin: 0; box-sizing: border-box;
    }

    body{

    }
    .codeContent{
      background: #fff; border-bottom: .15rem solid #f4f4f4; text-align: center; padding: 0.62rem 0;
    }
    .qr{
      padding: 0.18rem; background: #fff; width:3.66rem; height:3.66rem; box-shadow: 0px 0px 0.15rem 0.04rem rgba(224, 224, 224, 0.66); margin: 0 auto
    }
    .qr img{
      width: 3.3rem;
    }
    #qrcode img{
      width: 3.3rem;
    }
    #qrcode canvas{
      width: 3.3rem;
    }
    .qrtips{
      color: #00BFFF; font-size: 0.24rem; margin-top: 0.2rem; font-weight: bolder;
    }
    .list{
      font-size: 0.26rem; color: #666666; font-weight: 600; padding:0.2rem 0.42rem 0; width: 7.5rem; margin-bottom: 1.7rem;
    }
    .list div{
      width: 100%; margin-top: 0.22rem
    }
  </style>
</head>
<body>

<input id="text" type="text" value="{$unifyqrcode}" style="display: none;" />
<div class="codeContent">
<div class="qr" id="qrcode">
  {if $state eq 2}
  <img src="{__SGHOME_PATH}images/yishixiao.jpg" />
  {/if}
</div>
<div class="qrtips">{if $state eq 1}访客码(每隔30秒自动刷新){elseif $state eq 2}访客码{/if}</div>
</div>

<div class="list">
  <div>邀约码：{$visitorinfo.visitorkey}</div>
  <div>访客姓名：{$visitorinfo.visitoruname}</div>
  <div>访客手机号码：{$visitorinfo.visitorphone}</div>
  <div>来访人数：{$visitorinfo.visitornum}</div>
  <div>拜访开始时间：{$visitorinfo.visitorstime|date='Y-m-d H:i',###}</div>
  <div>拜访结束时间：{$visitorinfo.visitoretime|date='Y-m-d H:i',###}</div>
  <div>拜访地址信息：浙江省杭州市西湖区杭大路1号黄龙世纪广场{$visitorinfo.visitorbuilderinfo}</div>
  {if $visitorinfo.visitorcarnum}
  <div>访客车牌号码：{$visitorinfo.visitorcarnum}</div>
  {/if}
  <div>来访事由：{$visitorinfo.visitor_reason}</div>
</div>

</body>
<script>
  var qrcode = new QRCode(document.getElementById("qrcode"), {
    width : 400,
    height : 400
  });

  var hex_data = "{$ladderqrcodeinfo.hex_data}";

  function makeCode () {
    var elText = document.getElementById("text");
    if (!elText.value) {
      alert("Input a text");
      elText.focus();
      return;
    }
    qrcode.makeCode(elText.value);
    console.log(elText.value);
    console.log(hex_data);
    $("#qrcode canvas").removeAttr("style");
    $("#qrcode img").css("display","none")
  }

  var state = '{$state}';

  layui.use(['element', 'form', 'jquery', 'laydate', 'lucky'], function () {

    var element = layui.element;
    var table = layui.table;
    var form = layui.form;
    var $ = layui.jquery;
    var laydate = layui.laydate;
    var upload = layui.upload;
    var lucky = layui.lucky;

    if(state == 1){
      makeCode();
      var timerID = setInterval(function(){
        location.reload();
      }, 30000);
    }

  });
</script>
</html>